@using SmartStore.Rules
@model IRuleExpression
@{
    var metadata = Model.Descriptor.Metadata;
    var id = string.Concat("rule-value-", Model.Id);

    var format = (metadata.Get("DateTimeFormat") as string).NullEmpty() ?? "L LT";
    var pickTime = format == "L LT";
    var timeOnly = format == "LT";

    DateTime? value = null;
    if (Model.Value != null)
    {
        value = Convert.ToDateTime(Model.Value, System.Globalization.CultureInfo.CurrentCulture);
        value = value.ToLocalTime();
    }

    var strValue = string.Empty;
    if (value.HasValue && value.Value > DateTime.MinValue)
    {
        strValue = timeOnly
            ? value.Value.ToShortTimeString()
            : (pickTime ? value.Value.ToString() : value.Value.ToShortDateString());
    }
}
<div class="date datetimepicker-group" id="@id-parent" data-date="@strValue" data-target-input="nearest" style="display: flex; flex-grow: 1;">
    @Html.TextBox(id, strValue, new { @class = "form-control datetimepicker-input", data_target = "#" + id + "-parent", data_format = format })
	<div class="input-group-append input-group-addon" data-target="#@(id)-parent" data-toggle="datetimepicker">
		<span class="input-group-text"><i class="far @(timeOnly ? "fa-clock" : "fa-calendar-alt")"></i></span>
	</div>
</div>

<script>
    $(function () {
        var dtPicker = $('#@(id)-parent');
        dtPicker.datetimepicker({ format: '@(format)', useCurrent: false, locale: moment.locale() });
        dtPicker.on('change.datetimepicker', onRuleValueChanged);
	});
</script>